<template></template>
<script>
import { Cesium3DTileset } from "cesium";
import { Timeline } from "element-ui";
export default {
  name: "Cesium3DTileset",
  props: {
    tilesetOptions: {
      type: Object,
      default: () => {
        return {};
      },
    },
    preConfig: {
      type: Function,
      default: () => {},
    },
    autoZoom: {
      type: Boolean,
      default: true,
    },
    show: {
      type: Boolean,
      default: true,
    },
  },
  watch: {
    show(n) {
      if (this.entity) {
        this.entity.show = n;
      }
    },
  },
  mounted() {
    this.createTileset(this.$parent.viewer);
  },
  beforeDestroy() {
    this.removeTileset(this.$parent.viewer);
  },
  methods: {
    createTileset(viewer) {
      if (!viewer) return;
      this.entity = new Cesium3DTileset({
        ...this.tilesetOptions,
        // ...Object.freeze(this.tilesetOptions),//不可控制显隐
        skipLevelOfDetail: true,
        immediatelyLoadDesiredLevelOfDetail: false,
        loadSiblings: false,
        preloadFlightDestinations: false,
        maximumScreenSpaceError: 64,
        loadSiblings: true,
        cullRequestsWhileMovingMultiplier: 5,
        skipLevelOfDetail: true,
        preferLeaves: true,
        progressiveResolutionHeightFraction: 0.5,
        dynamicScreenSpaceError: true,
        preloadWhenHidden: true,
        maximumMemoryUsage: 512,
      });
      this.entity.initialTilesLoaded.addEventListener(() => {
        this.$emit("ready");
      });

      this.entity.$emit = this.$emit.bind(this);

      this.entity.readyPromise.then(() => {
        this.preConfig(this.entity);
        if (this.autoZoom) {
          this.zoomTo();
        }

        this.entity.show = this.show;
      });
      viewer.scene.primitives.add(this.entity);
    },
    zoomTo() {
      const viewer = this.$parent.viewer;
      viewer.zoomTo(this.entity);
    },
    removeTileset() {
      try {
        this.$parent.viewer?.scene?.primitives?.remove(this.entity);
      } catch (error) {}
    },
  },
};
</script>
